﻿html,
body,
div,
aside,
ul,
li,
a {
  margin: 0;
  padding: 0;
}
body {
  width: 960px;
  font-family: Arial, 'DejaVu Sans', 'Liberation Sans', Freesans, sans-serif;
  font-size: 16px;
}
body div#wrapper aside {
  display: inline-block;
  background: #d29bff;
  /* Old browsers */

  background: -moz-linear-gradient(top, #d29bff 0%, #8977ff 100%);
  /* FF3.6+ */

  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #d29bff), color-stop(100%, #8977ff));
  /* Chrome,Safari4+ */

  background: -webkit-linear-gradient(top, #d29bff 0%, #8977ff 100%);
  /* Chrome10+,Safari5.1+ */

  background: -o-linear-gradient(top, #d29bff 0%, #8977ff 100%);
  /* Opera 11.10+ */

  background: -ms-linear-gradient(top, #d29bff 0%, #8977ff 100%);
  /* IE10+ */

  background: linear-gradient(to bottom, #d29bff 0%, #8977ff 100%);
  /* W3C */

  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#d29bff', endColorstr='#8977ff', GradientType=0);
  /* IE6-9 */

  border-radius: 10px;
  margin: 10px 20px;
}
body div#wrapper aside ul {
  list-style-type: none;
}
body div#wrapper aside a {
  text-decoration: none;
  font-family: Arial, 'DejaVu Sans', 'Liberation Sans', Freesans, sans-serif;
  font-size: 16px;
  color: black;
}
body div#wrapper aside > ul {
  padding: 5px 0px;
  list-style-type: none;
}
body div#wrapper aside > ul > li {
  position: relative;
  padding: 5px 15px;
  margin: 0px 15px;
  border-bottom: 1px solid #9D00FF;
}
body div#wrapper aside > ul > li ul {
  display: none;
}
body div#wrapper aside > ul > li > a {
  font-size: 1.4em;
}
body div#wrapper aside > ul > li:last-of-type {
  border-bottom: none;
}
body div#wrapper aside > ul > li:hover {
  border: 1px solid #9D00FF;
  border-radius: 5px;
}
body div#wrapper aside > ul > li:hover > ul {
  position: absolute;
  left: 190px;
  top: -5px;
  background-color: #B5AAFF;
  border-radius: 10px;
  display: inline-block;
  padding: 5px 0px;
  padding-left: 5px;
  background-image: url('imgs/arrow.png');
  background-repeat: no-repeat;
  background-position: 5px 15px;
}
body div#wrapper aside > ul > li:hover > ul > li {
  padding-top: 5px;
  padding-bottom: 5px;
  margin-top: 0px;
  margin-bottom: 0px;
  margin-left: 15px;
  margin-right: 5px;
  border-bottom: 1px solid #9D00FF;
  width: 210px;
  text-align: center;
}
body div#wrapper aside > ul > li:hover > ul > li > a {
  font-size: 1.1em;
}
body div#wrapper aside > ul > li:hover > ul > li:last-of-type {
  border-bottom: none;
}
body div#wrapper aside > ul > li:hover > ul > li:hover {
  border: 1px solid #9D00FF;
  border-radius: 5px;
}
